<template>
  <div>
    <h1>v-for更新检测</h1>
    <ul>
      <li v-for="(val, idx) in arr"
          :key="idx"> {{val}}</li>
    </ul>
    <button @click="reverse">翻转数组</button>
    <button @click="sliceArr">截取数组</button>
    <button @click="updateBtn">更新数组中的第一个元素</button>
  </div>

</template>

<script>
export default {
  data () {
    return {
      arr: ['小李', '小明', '小可爱']
    }
  },
  methods: {
    reverse () {
      this.arr.reverse()
    },
    sliceArr () {
      this.arr = this.arr.slice(0, 1)
    },
    updateBtn () {
      this.$set(this.arr, 1, '八百标兵')//将数组中的第一项修改
    }
  }
}
</script>

<style>
</style>